<%@ page import="java.util.List" %>
<%@ page import="com.hzit.bean.Emp" %>

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/10/10 0010
  Time: 13:59
  To change this template use File | Settings | File Templates.

  page:表示当前jsp页面的指令，设置页面的属性
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>表格</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/frame/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/frame/static/css/style.css">
    <link rel="icon" href="${pageContext.request.contextPath}/frame/static/image/code.png">
</head>
<body class="body">

<%--导航--%>
<ul class="layui-nav">
    <li class="layui-nav-item">
        <a href="">控制台<span class="layui-badge">9</span></a>
    </li>
    <li class="layui-nav-item">
        <a href="">个人中心<span class="layui-badge-dot"></span></a>
    </li>

    <c:if test="${not empty userInfo}">


        <li class="layui-nav-item">
                <%--
                        ${userInfo.username}:EL表达式，从域中获取数据
                --%>
            <a href=""><img src="//t.cn/RCzsdCq" class="layui-nav-img">${userInfo.username}</a>
            <dl class="layui-nav-child">
                <dd><a href="javascript:;">修改信息</a></dd>
                <dd><a href="javascript:;">安全管理</a></dd>
                <dd><a href="${pageContext.request.contextPath}/user/loginOut">退了</a></dd>
            </dl>
        </li>

        <li class="layui-nav-item">
            <a href="${pageContext.request.contextPath}/jsp/Online.jsp">在线用户!</a>
        </li>
    </c:if>

    <c:if test="${empty userInfo}">
        <li class="layui-nav-item">
            <a href="${pageContext.request.contextPath}/jsp/Login.jsp">您好，请登录!</a>
        </li>
    </c:if>


</ul>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>默认表格</legend>
</fieldset>

<div class="layui-fluid">


    <div class="layui-row">
        <div class="layui-col-lg2 layui-col-lg-offset2">
            <a href="/web_manage/jsp/EmpAdd.jsp" class="layui-btn layui-bg-cyan"> 添加员工 </a>
            <button class="layui-btn layui-bg-red" id="delAll"> 批量删除</button>

            <button class="layui-btn layui-bg-red"> 访问次数:
                <span class="layui-badge">${PAGE_COUNT_EMP_ALL}</span>
            </button>

        </div>
        <div class="layui-col-lg6 layui-col-lg-offset2">
            <form class="layui-form" action="${pageContext.request.contextPath}/emp/all">
                <div class="layui-form-item">

                    <div class="layui-input-inline">
                        <select name="search_type" lay-verify="required">
                            <option value="-1">请选择搜索条件</option>
                            <option value="empno">按照员工编号查询</option>
                            <option value="ename">按照员工姓名查询</option>
                            <option value="job">按照员工职位查询</option>
                            <option value="deptno">按照部门查询</option>
                        </select>
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="search_val" placeholder="search"
                               autocomplete="off"
                               class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="submit" id="search_btn" value="搜索" class="layui-btn layui-bg-green">
                        <input type="submit" id="search_btn_ajax" value="ajax搜索" class="layui-btn layui-bg-green">
                    </div>

                </div>
            </form>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-lg8 layui-col-lg-offset2">

            <%--
                el表达式提供了可以直接从域对象中获取数据
                    但是如果不指定域: 全域查找  从小到大依次查找: pageScope-->requestScope-->sessionScope-->applicationScope

            --%>

            <%--            <h1>----> ${not empty empList}</h1>--%>
            <%--            <h1>${empList[0]}</h1>--%>
            <table class="layui-table">
                <%--                </colgroup>--%>
                <thead>
                <tr>
                    <th><input type="checkbox" name="all"/></th>
                    <th>序号</th>
                    <th>JSESSIONID</th>
                    <th>用户编号</th>
                    <th>登录名称</th>
                    <th>登录IP</th>
                    <th>最后登录时间</th>

                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                <%--
                    jsp=html+java

                    jsp当中如果写java代码，必须通过<%%> 小脚本

                    需要输入java的变量:<%= %> 表达式


                    jsp提供了9大内置对象，包含了常用的:
                        request,
                        response,
                        out,
                        pageContext
                --%>


                <%--                <%--%>
                <%--                    Object object = request.getAttribute("empList");--%>

                <%--                    List<Emp> list = null;--%>
                <%--                    if (object != null) {--%>
                <%--                        list = (List<Emp>) object;--%>
                <%--                    }--%>

                <%--                    int index = 0;--%>
                <%--                    for (Emp emp : list) {--%>
                <%--                        index++;--%>
                <%--                        //}--%>

                <%--                %>--%>


                        <tr>
                            <td><input type="checkbox" name="op"></td>
                            <td>1</td>
                            <td>xxx
                            </td>
                            <td>1001
                            </td>
                            <td>张三
                            </td>
                            <td>192.168.1.117
                            </td>
                            <td>2020-10-16 17:34:10
                            </td>
                            <td><a href="${pageContext.request.contextPath}/emp/sss?empno=${emp.empno}"
                                   class="layui-btn layui-btn-mini layui-bg-blue">强制下线</a></td>
                        </tr>



                </tbody>
            </table>

            <%--           el 获取参数--%>

            <%--            <h1>${param.page}</h1>--%>
            <%--            <h1>${param.size}</h1>--%>
            <%--            <h1>${paramValues.love[0]} ${paramValues.love[1]}</h1>--%>

            <%--            <h1>${header.host}</h1>--%>

        </div>


    </div>
    <div class="layui-row">
        <div class="layui-col-lg12">
            <p style="height: 100px"></p>

        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-lg4 layui-col-lg-offset4">
            <div class="layui-btn-group">
                <button type="button" class="layui-btn layui-btn-primary">上一页</button>

                <c:forEach var="i" begin="1" end="${pageCount}">

                    <c:if test="${param.page == i}">
                        <a href="${pageContext.request.contextPath}/emp/all?page=${i}&pageSize=2"
                           class="layui-btn ">${i}</a>
                    </c:if>
                    <c:if test="${param.page != i}">
                        <a href="${pageContext.request.contextPath}/emp/all?page=${i}&pageSize=2"
                           class="layui-btn layui-btn-primary ">${i}</a>
                    </c:if>


                </c:forEach>

                <button type="button" class="layui-btn layui-btn-primary">下一页</button>

            </div>
        </div>
    </div>
</div>


<script type="text/javascript" src="../frame/layui/layui.js"></script>
<script type="text/javascript">
    //注意：导航 依赖 element 模块，否则无法进行功能性操作
    layui.use(['element', 'form', 'jquery', 'layer'], function () {
        var element = layui.element,
            form = layui.form,
            $ = layui.$,
            layer = layui.layer;

        //自动匹配搜索条件
        var p = '${param.search_type}';
        if ('${param.search_type}' == null || '${param.search_type}' == '') {
            p = '-1';
        }

        $("[name='search_type']+div").find("dd[lay-value=" + p + "]").click();


        //批量删除 delAll
        $("#delAll").click(function () {

            //1.用户是否选中复选框，如果没有选中， 提示用户先选中
            var length = $("[name='op']:checked").length;
            if (length == 0) {
                layer.msg('没有选中，请选择需要删除的数据!', {icon: 2});
                return;
            }

            var ids = [];

            var nodeList = $("[name='op']:checked");
            $.each(nodeList, function (index, ele) {
                var id = $(this).parents("tr").find("td:eq(2)").text().trim();
                ids.push(id);
                console.log("del:" + id);
            })

            console.log("ids:" + ids);
            //2.如果选中，提示用户是否确认删除
            if (ids.length > 0) {

                layer.confirm('确认是否删除?', {icon: 3, title: '警告'}, function (index) {
                    //传递数组，服务端获取数组
                    location.href = '${pageContext.request.contextPath}/emp/delete/all?ids=' + ids;
                    layer.close(index);
                });

            }
            //3.调用删除的方法
        });
    });
</script>
</body>
</html>